// 所有layouts中组件样式
.app-source{
  position:fixed;
  bottom:20px;
  right:-13px;
  font-size:12px;
  border-radius:3px;
  background-color:rgba(#000, .7);
  border:1px solid #000;
  z-index:9999;
  transition:all .3s;
  padding-right:13px;
  a{
    color:#fff;
    padding:5px 15px;
  }
  &:hover{
    right:-8px;
    background-color:rgba(#000, .9);
  }
}
.app-header{
  display:flex;
  padding:0 20px 0 0;
  color:#333;
  background:#fff;
  .app-header-nav{
    flex-wrap:wrap;
  }
  .app-helper-menu{
    margin-left:auto;
    display:flex;
    .app-name{
      margin-left:10px;
    }
  }
  .header-dropdown-wrap{
    margin-right:10px;
    &:hover{
      cursor:pointer;
    }
  }
}
.bytemd{
  height:calc(100vh - 235px) !important;
}
.cm-editor{
  height:calc(100vh - 235px) !important;
  border-radius:5px;
  overflow:hidden;
  .cm-line{
    line-height:23px;
  }
}
.app-card-header-form.query{
  .ant-form-item-control-input-content{
    display:flex;
    .ant-form-item{
      margin-bottom:0;
      margin-right:20px;
    }
  }
}
.app-table-action{
  padding-bottom:20px;
  display:flex;
  justify-content:space-between;
}
.app-table-page{
  display:flex;
  justify-content:space-between;
  padding:20px 0 0;
  line-height:50px;
}
.app-table-container{
  min-height:calc(100vh - 280px);
  padding-bottom:0;
}
.app-table-action-button{
  .ant-btn .anticon{
    font-size:13px;
  }
}
.app-view{
  .ant-card-body{
    min-height:calc(100vh - 200px);
  }
}
// app tag view
.app-tagsview{
  white-space:nowrap;
  width:100%;
  height:36px;
  line-height:36px;
  border-bottom:1px solid #d8dce5;
  box-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);
  background:#fff;
  .ant-tabs-card{
    .ant-tabs-nav{
      .ant-tabs-tab{
        line-height:35px;
        margin-right:0;
        margin-left:0 !important;
        border:0;
        border-left:1px solid #f6f6f6;
        border-radius:0;
        padding:0 14px;
        cursor:pointer;
        background-color:#fff;
        vertical-align:top;
        font-size:12px;
        border-radius:0 !important;
        &:first-of-type{
          margin-left:15px !important;
          border-left:1px solid #f6f6f6;
          text-indent:-999em;
          padding:0 20px;
          background:url(@/assets/home-icon.png) 50% 50% no-repeat;
          &:hover{
            background-color:#fff;
          }
          .ant-tabs-tab-remove{
            display:none;
          }
          .ant-tag{
            border:0;
          }
        }
        .ant-tabs-tab-remove{
          margin-left:0;
          margin-right:0;
        }
        svg{
          width:0;
          transition:all 0.15s;
        }
        &:hover{
          svg{
            width:1em;
          }
          background-color:#f2f3f5;
          .anticon-close{
            opacity:1;
            margin-left:7px;
          }
        }
        .anticon-close{
          color:#999;
          opacity:0.6;
          position:relative;
          margin-left:0;
          &:hover{
            color:#666;
            border-radius:8px;
            padding:2px;
            margin-right:-4px;
            background-color:#ccc;
            opacity:1;
          }
        }
        &.ant-tabs-tab-active{
          background-color:#42b983;
          border-color:#42b983;
          .ant-tabs-tab-btn{
            color:#fff;
          }
          .anticon-close{
            color:#fff;
            &:hover{
              color:#333;
              background-color:#fff;
            }
          }
          &:first-of-type{
            border-color:#42b983;
            background: url(@/assets/home-hover-icon.png) #42b983 50% 50% no-repeat;
          }
        }
      }
    }
    .ant-tabs-tab-btn{
      transition:none;
    }
    .ant-tabs-extra-content{
      margin-right:10px;
    }
    //newversion
    & > li{
      display:inline-block;
      &:first-of-type{
        margin-left:15px;
        border-left:1px solid #f6f6f6;
        .ant-tag{
          border:0;
        }
      }
      &:last-of-type{
        margin-right:15px;
        border-right:1px solid #f6f6f6;
      }
      &.tag-home{
        .ant-tag{
          padding:0 13px;
        }
        svg{
          width:1em;
        }
      }
    }
    .ant-tag{
      line-height:35px;
      margin-right:0;
      border:0;
      border-left:1px solid #f6f6f6;
      border-radius:0;
      padding:0 12px;
      cursor:pointer;
      background-color:#fff;
      vertical-align:top;
      .anticon-close{
        padding-left:3px;
        &:hover{
          color:#333;
        }
      }
      svg{
        width:0;
        transition:all 0.15s;
      }
      &:hover{
        svg{
          width:1em;
        }
        background-color:#f2f3f5;
        .anticon-close{
          opacity:1;
        }
      }
      .anticon-close{
        color:#999;
        opacity:0.6;
        position:relative;
        margin-left:7px;
        &:hover{
          color:#666;
          border-radius:8px;
          padding:2px;
          margin-right:-1px;
          background-color:#ccc;
          opacity:1;
        }
      }
    }
    .tag-active{
      svg{
        width:1em;
      }
      .ant-tag{
        background-color:#42b983;
        color:#fff;
        border-color:#42b983;
        .anticon-close{
          color:#fff;
          &:hover{
            color:#333;
            background-color:#fff;
          }
        }
      }
    }
  }
  .contextmenu{
    margin:0;
    background:#fff;
    z-index:3000;
    position:absolute;
    list-style-type:none;
    padding:5px 0;
    border-radius:4px;
    font-size:12px;
    font-weight:400;
    color:#333;
    box-shadow:2px 2px 3px 0 rgba(0, 0, 0, .3);
    li{
      margin:0;
      padding:0px 16px;
      height:30px;
      cursor:pointer;
      &:hover{
        background:#eee;
      }
    }
  }
}
.app-weather-no-main{
  #sec-main{
    display:none;
  }
  &.min{
    #sec-tomorrow{
      border-bottom:none;
    }
  }
}
